<template>
  <mt-popup class="info-modal-popup" v-model="popupVisible" :closeOnClickModal="closeOnClickModal">
    <div @click="popupHide"
         class="zhk-alert_close"></div>
    <div class="head">{{infoTitle}}</div>
    <div class="ct-unli">
      {{ctUnli}}
    </div>
    <div class="ct">
      <p v-for="(item,index) in infoText"
         :key="index">
        <span>•</span>{{item}}</p>
    </div>
  </mt-popup>
</template>

<script>
import Vue from 'vue';
import { Popup } from 'mint-ui';
Vue.component(Popup.name, Popup);
export default {
	name: 'InfoModalPopup',
	data() {
		return {
			popupVisible:false,
			closeOnClickModal:false
    };
	},
	props: {
		infoText: {
			type: Array,
		},
		infoTitle: {
			type: String,
		},
		ctUnli: {
			type: String,
    },
	},
	mounted() {
    this.popupVisible=true;
		document.body.appendChild(this.$el);
	},
	methods: {
		popupHide() {
			this.$emit('listenToInfoModalPopupHide');
		},
	},
	beforeDestroy() {
		if (this.$el && this.$el.parentNode) {
			this.$el.parentNode.removeChild(this.$el);
		}
	},
};
</script>

<style lang="scss" scoped>
@import 'InfoModalPopup';
</style>
